import React, { Component } from 'react'
import {connect} from "react-redux"

export class Det extends Component {
    state={
        ind:0,
        name:this.props.location.obj.name,
        data:this.props.location.obj.data,
        msg:this.props.location.obj.msg,
        ups:this.props.location.obj.ups
    }

  

    render() {   
        console.log(this.props.location.obj)
          let datas = ["先生","女士"]
          let {name,data,msg,ups} = this.props.location.obj
          console.log(name,msg,data,ups)
        return (
   

            <div className="wrapper">
                <header>
                    修改收货地址
                </header>
                <p className="name">
                    收货人 <input type="text" placeholder="姓名" value={this.state.name} onChange={(e)=>{this.setState({name:e.target.value})}}/>
                </p>
                <p className="name">
                    电话 <input type="text" placeholder="收货人手机号码" value={this.state.msg} onChange={(e)=>{this.setState({msg:e.target.value})}}/>
                </p>
                <div className="name">
                      {
                          datas.map((item,index)=>{
                                return <span key={index} onClick={()=>{

                                    this.setState({ind:index
                                    },()=>{
                                        this.setState({ups:datas[this.state.ind]})
                                    })
                                }} className={this.state.ind===index?"action":""}>{item} </span>
                          })
                      }
                </div>
              
                <p className="name">
                    详细地址 <input type="text" placeholder="请手动输入详细收货地址" value={this.state.data} onChange={(e)=>{this.setState({data:e.target.value})}}/>
                </p>
                <div className="btns">
                      <span onClick={()=>{this.props.addset(this.props.location.obj.name,this.state)}}>保存</span>
                </div>
            </div>
        )
    }
}


export default connect(
    (state)=>{
        let {data} = state
        return {
            data
        }
    }
    ,(dispatch)=>{
        return {
           addset(name,obj){
              console.log(obj)
               dispatch({type:"addset",name,obj})
           }
        }
    }
)(Det)

